import React, { createRef, useRef } from 'react'
/*
引入createRef存储dom元素对象
里面有一个对象current
刚开始创建的时候是一个null的状态

useRef和createRef用法一致
钩子本质上都是函数,引用时必须加括号

区别createRef每一次重新渲染的时候都会创建一个新的ref对象
useRef在第一次渲染一个对象以后,之后重新渲染时,如果发现这个对象已经
创建过就不再创建新的useRef对象
所以useRef性能要好一些
*/
export default function Hook7() {
    const inputRef = createRef();
    const useInputRef = useRef();
    console.log(inputRef)
    return (
        <div>
            <input type="text" ref={inputRef} />
            <button onClick={e => { inputRef.current.focus() }}>对焦</button>
            <br />
            <input type="text" ref={useInputRef} />
            <button onClick={e => { useInputRef.current.focus() }}>对焦</button>
        </div>
    )
}
